<template>
	<view class="scan-h5 vw100 df-yc">
		<image class="back-img" style="width: 750rpx;" :src="temImgUrl+'/h5bg.jpg'" mode="widthFix">
		</image>
		<view class="logo">
			<image style="width: 147rpx;" :src="temImgUrl+'/logo.png'" mode="widthFix"></image>
		</view>
		<view class="content wh100 df-yc">
			<view style="color: #622129;" class="title shsc fb">
				喝好茶,成好事
			</view>
			<view style="color: #622129;" class="little fb fs24 df-yc">
				千秋大业一壶茶，中国的历史群星闪耀之时，<br />
				总有中国茶的相伴。
			</view>
			<view class="text fs24 fb df-yc">
				茶能成事的创立便源于一个极为朴素的思考：什么才是中国茶传承与创新该有的样子？如何让天下茶友喝到好茶？如何让对茶之爱一脉相承，薪火相继？茶能成事创始团队以15年行业深耕遍寻天下好茶，历经挑选,诚意出品。愿每一杯好茶，<br />都相伴成事。
			</view>
			<view @click="demo" class="button df-c fs28 white">
				<text class="mr20">进入茶能成事小程序</text>
				<u-icon name="arrow-rightward"></u-icon>
			</view>
		</view>
		<remote-js src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js">
		</remote-js>
	</view>
</template>
<script>
	export default {
		components: {
			'remote-js': {
				render(createElement) {
					return createElement('script', {
						attrs: {
							type: 'text/javascript',
							src: this.src
						}
					});
				}
			}
		},
		data() {
			return {
				temImgUrl: this.$IMG_URL_TEMP
			};
		},
		created() {
			// this.$api('wechat.jssdk', {
			// 	url: window.location.href
			// }).then(res => {
			// 	console.log(res)
			// })
		},
		UniAppJSBridgeReady() {
			uni.getEnv(function(res) {
				console.log('当前环境：' + JSON.stringify(res));
			});
		},
		methods: {
			get() {
				uni.config({

				})
			},
			demo() {
				this.$jweixin.miniProgram.navigateTo({
					url: '/pages/index/index'
				})
			}
		}
	}
</script>

<style lang="scss">
	* {
		margin: 0;
		padding: 0;
	}

	.scan-h5 {
		height: 1624rpx;
		position: relative;

		.back-img {
			position: absolute;
			top: 0;
			left: 0;
		}

		.logo {
			position: absolute;
			top: 140rpx;
			left: 30rpx;
		}

		.content {
			position: absolute;
			z-index: 999;

			.title {
				font-size: 56rpx;
				margin-top: 400rpx;
			}

			.little {
				margin-top: 40rpx;
			}

			.text {
				width: 518rpx;
				height: 263rpx;
				color: #444444;
				line-height: 48rpx;
				text-align: justify;
				margin-top: 94rpx;
			}

			.button {
				width: 520rpx;
				height: 110rpx;
				background: linear-gradient(270deg, #53181E, #7D333B);
				box-shadow: 0px 5rpx 18rpx 0px rgba(83, 24, 30, 0.35);
				border-radius: 55rpx;
				margin-top: 150rpx;
			}
		}
	}
</style>
